import { ConfigProvider, Table } from 'antd'
import { TableGridProps } from './constants'
import './style.less'

const TableGrid = ({ className = '', tableInfo, emptyComponent }: TableGridProps) => {
  const {
    tableData,
    tableColumns,
    getUniqueKey,
    // tableIsLoading = false,
    getTableChangeValues,
    rowSelection,
    scrollHeight = undefined,
    scrollWidth = undefined,
    tableRef = undefined
  } = tableInfo

  // table的分页、排序、筛选变化时触发.需要选中框和排序时进行处理
  const handleTableChange = (pagination: any, _filters: any, sorter: any) => {
    // const { current: pageNo, pageSize } = pagination
    // let { columnKey: sortKey, order: sortType } = sorter
    // if (sortType) {
    //   sortType = sortType === 'descend' ? 'desc' : 'asc'
    // }
    // if (getTableChangeValues) {
    //   getTableChangeValues({ pageNo, pageSize, sortKey, sortType })
    // }
  }

  return (
    <div className={`migu-table-container ${className}`}>
      <ConfigProvider renderEmpty={() => emptyComponent}>
        <Table
          ref={tableRef}
          columns={tableColumns}
          dataSource={tableData}
          bordered={false}
          rowKey={(record: any) => getUniqueKey(record)}
          scroll={{ x: scrollWidth, y: scrollHeight }}
          onChange={handleTableChange}
          rowSelection={rowSelection}
          className="migu-common-table"
          pagination={false}
        />
      </ConfigProvider>
    </div>
  )
}
export default TableGrid
